<template>
	<view class="container">
		<view class="userInfo" v-if="user">
			<u-avatar src="/static/no_user.png" size="50"></u-avatar>
<!--			<view class="info">-->
<!--				<u&#45;&#45;text :text="defaultAddress?defaultAddress.person:user.nickName" size="18" lingHeight="24"></u&#45;&#45;text>-->
<!--				<u&#45;&#45;text mode="phone" :text="defaultAddress?defaultAddress.mobile:''" size="14" lingHeight="24"-->
<!--					color="#979797" format="encrypt"></u&#45;&#45;text>-->
<!--			</view>-->
			<view class="info">
				<u--text :text="user.nickName" size="18" lingHeight="24"></u--text>
				<u--text mode="phone" v-if="user.mobile" :text="user.mobile" size="14" lingHeight="24"
					color="#979797" format="encrypt"></u--text>
				<u--text mode="phone" v-if="!user.mobile" text="游客" size="14" lingHeight="24"
					color="#979797" format="encrypt"></u--text>
			</view>
		</view>
		<view class="userInfo" v-else>
			<u-avatar src="/static/no_user.png" size="50"></u-avatar>
			<view class="info" @tap="goLogin">
				<u--text text="点击登录" size="18" lingHeight="24"></u--text>
				<u--text text=" " size="14" lingHeight="24" color="#979797"></u--text>
        <view style="margin-top: 10px"><u--text text="登录体验更多功能" color="#9aa3b0" size="12" lingHeight="12"></u--text></view>
      </view>
		</view>
		<view class="function_list">
			<u-list>
				<view v-if="user">
					<u-list-item>
						<u-cell title="我的回收单" icon="/static/hsd.png"
							:iconStyle="{width:'48rpx',height:'48rpx',marginRight:'14rpx'}"
							:titleStyle="{fontSize:'28rpx'}" :isLink="true" arrow-direction="right"
							url="/pagesB/recycling/recycling_forms" :rightIconStyle="{fontSize: '24rpx',color:' #C8C9CC'}">
						</u-cell>
					</u-list-item>
					<u-list-item>
						<u-cell title="收货地址管理" icon="/static/address.png"
							:iconStyle="{width:'48rpx',height:'48rpx',marginRight:'14rpx'}"
							:titleStyle="{fontSize:'28rpx'}" :isLink="true" arrow-direction="right"
							url="/pages/mine/address_management" :rightIconStyle="{fontSize: '24rpx',color:' #C8C9CC'}">
						</u-cell>
					</u-list-item>
					<u-list-item>
						<u-cell title="关于我司" icon="/static/about.png"
							:iconStyle="{width:'48rpx',height:'48rpx',marginRight:'14rpx'}"
							:titleStyle="{fontSize:'28rpx'}" :isLink="true" arrow-direction="right"
							url="/pagesB/about/about" :rightIconStyle="{fontSize: '24rpx',color:' #C8C9CC'}">
						</u-cell>
					</u-list-item>
				</view>
				<!-- <u-list-item>
					<u-cell title="关注公众号" icon="/static/gzgzh.png"
						:iconStyle="{width:'48rpx',height:'48rpx',marginRight:'14rpx'}" :titleStyle="{fontSize:'28rpx'}"
						url="/pages/mine/webview" :isLink="true" arrow-direction="right"
						:rightIconStyle="{fontSize: '24rpx',color:' #C8C9CC'}">
						<text slot="value" class="value_class">获取更多资讯</text>
					</u-cell>
				</u-list-item> -->
			</u-list>
		</view>
		<customTabbar tabVal="mine/mine" />
	</view>
</template>

<script>
	import customTabbar from '@/components/custom_tabbar.vue'
	import {
		getAddress
	} from "@/api/user.js";
	import {
		mapState,
		mapActions,
		mapMutations
	} from 'vuex';
  import {getUserInfo} from "../../api/user";
	export default {
		computed: {
			...mapState(["user"])
		},
		components: {
			customTabbar
		},
		data() {
			return {
				defaultAddress: null
			};
		},
		onLoad(option) {
			let query = {
				username: this.user.username
			};
			getAddress(query).then(res => {
				console.log("getAddress",res)
				let defaultAdd = res.data.find(item => {
					return item.is_default == 1
				})
				if (defaultAdd !== undefined) {
					this.defaultAddress = defaultAdd;
				} else {
					if (res.data.length > 0) {
						this.defaultAddress = res.data[0];
					} else {
						this.defaultAddress = null;
					}
				}
			}).catch(err => {
				console.error(err);
			})
		},
    onShow(){
      this.getUserInfo()
    },
    mounted() {
    },
    methods: {
      ...mapMutations(['setUser']), // 映射 setUser 方法到组件
      getUserInfo(){
        let data = { ...this.user }
        getUserInfo().then((res) => {
          if(res.code === 0){
            data.mobile = res.data[0].mobile;
            // 提交 mutation 来更新 Vuex 状态
            this.setUser(data);
          }else{
            this.$store.commit('setUser', null);
            // this.goLogin()
          }

        })
      },
			goLogin() {
        uni.navigateTo({
          url: "/pagesB/Login/index"
        })
			}
		},
    onShareAppMessage() {
      return{
        title:'科动赫',
        path:'/pages/index/index'
      }
    }
	}
</script>

<style lang="scss" scoped>
	.userInfo {
		display: flex;
		align-items: center;

		.info {
			margin-left: 32rpx;
		}
	}

	.value_class {
		font-size: 24rpx;
		color: #C8C9CC;
	}

	.function_list {
		margin-top: 40rpx;
	}
</style>
